<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
	<meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
	<title></title>

	<link rel="stylesheet" href="__STATIC__/Bootstrap/Css/bootstrap.min.css" />
	<link rel="stylesheet" href="__PUBLIC__/Css/common.css" />
	<link rel="stylesheet" href="__STATIC__/uploadify.css" />
	<script type="text/javascript" src='__PUBLIC__/Js/jquery-1.7.2.min.js'></script>
	<script type="text/javascript" src='__STATIC__/Uploadify/jquery.uploadify.js'></script>
	<script type="text/javascript" charset="utf-8" src="__STATIC__/ueditor1_4_3/ueditor.config.js"></script>
	<script type="text/javascript" charset="utf-8" src="__STATIC__/ueditor1_4_3/ueditor.all.min.js"> </script>
    <script type="text/javascript" charset="utf-8" src="__STATIC__/ueditor1_4_3/lang/zh-cn/zh-cn.js"></script>
	
	<jsconst/>
	<script type="text/javascript">
		$(function(){	
	//添加一个规格
	$('.add-spec').live('click', function () {
		var tr = $(this).parents('tr');
		var obj = tr.clone();
		var del = '<span class="del-spec btn btn-info"><i class="icon-white icon-minus"></i>删除规格</span>';
		obj.find('td').eq(3).find('.add-spec').remove();
		obj.find('td').eq(3).append(del);
		tr.after(obj);
	});

	//删除一个规格
	$('.del-spec').live('click', function() {
		$(this).parents('tr').remove();
	});
	// 点击出现编辑器
	$('.next_show').click(function(){
		$(this).next().toggle(600);
	});	
	
		
		var ue = UE.getEditor('info');
		
		})
	</script>
	
	<style type="text/css">
		/*去掉uploadify上传按钮的边框*/
	    .uploadify-button {
	        background-color: transparent;
	        border: none;
	        padding: 0;
	    }
	    .uploadify:hover .uploadify-button {
	        background-color: transparent;
    	}
    	.hide{
    		display: none;
    	}
    	body{
    		margin-bottom: 100px;
    	}
    	.pic_div{
	    	border-radius:5px;
			max-width:100px;
	    	float:left;
	    	position:relative;
	    	margin-right:10px;
	    }
	    .pic_div img{
			width:100px;
	    	height:100px;
	    }
	</style> 

</head>
<body>
	<div class="container-fluid">
	<div class="row-fluid">
	<div class="span12">

	<form action="" method='post'  enctype="multipart/form-data">
		<fieldset>
			<legend>添加商品</legend>
			<table class='table table-bordered table-hover'>
				<thead>
					<tr>
						<th colspan="2" class="btn btn-primary">基本信息</th>
					</tr>
				</thead>
				<tbody>
					<tr class="info">
						<td>所属分类</td>
						<td>
							<select name="cid">
								<option value="0">-请选择-</option>
									<foreach from="$cateData" value="$v" key="$k">
									<option value="{$v.cid}" tid=''condition=''>{$v.cname}</option>
									</foreach>
							</select>
						</td>
					</tr>
					<tr class="info">
						<td>所属品牌</td>
						<td>
							<select name="bid">
								<option value="0">-请选择-</option>
									<foreach from="$brandData" value="$v" key="$k">
									<option value="{$v.bid}">{$v.bname}</option>
									</foreach>
							</select>
						</td>
					</tr>
					<tr class="info">
						<td>商品名称</td>
						<td>
							<input type="text" name='gname'/>
						</td>
					</tr>
					<tr class="info">
						<td>单位</td>
						<td>
							<input type="text" name='unit' value='件'/>
						</td>
					</tr>
					<tr class="info">
						<td>市价场</td>
						<td>
							<input type="text" name='market_price'/>
						</td>
					</tr>
					<tr class="info">
						<td>商城价</td>
						<td>
							<input type="text" name='shop_price'/>
						</td>
					</tr>
					<tr class="info">
						<td>货号</td>
						<td>
							<input type="text" name='goodscol'/>
						</td>
					</tr>
					<tr class="info">
						<td>销量</td>
						<td>
							<input type="text" name='sale'/>
						</td>
					</tr>
					<tr class="info">
						<td>商品库存</td>
						<td>
							<input type="text" name='inventory'/>
						</td>
					</tr>
					<tr class="info">
						<td>描述</td>
						<td>
							<input type="text" name='describe'/>
						</td>
					</tr>
				</tbody>
			</table>

			<p class="btn btn-primary">商品属性</p>
			<table class="table table-bordered table-hover" id='attr' class="info">
				<tr class="info">
						<td>属性名称</td>
						<td>
							<input type="text" name='attrname1[]'/>
													
						</td>
						<td>属性值</td>
						<td>
							<input type="text" name='attrvalue1[]'/>
							
						<td><span class="add-spec btn btn-success"><i class="icon-plus icon-white"></i>添加规格</span>
						
						</td>
					</tr>
				
			</table>
			<p class="btn btn-primary">商品规格</p>
			<table class="table table-bordered table-hover" id='spec'>
				<tr class="info">
						<td>属性名称</td>
						<td>
							<input type="text" name='attrname2[]'/>
							
													
						</td>
						<td>属性值</td>
						<td>
							<input type="text" name='attrvalue2[]'/>
							
						<td><span class="add-spec btn btn-success"><i class="icon-plus icon-white"></i>添加规格</span>
						
						</td>
					</tr>
					
			</table>

			<table class='table table-bordered'>
				<tr>
					<th colspan="3" class="btn btn-primary">列表图</th>
				</tr>
				<tr class="info">
					<td>上传图片</td>
					<td>
						<input type="file" name='list_pic' id='pic'/>
						<input type="hidden" name="list_pic" />
					</td>
					<td id='pic-list'><div id='p_list' style='display:none'></div></td>
				</tr>
			</table>

			<table class='table table-bordered'>
				<tr>
					<th colspan="3" class="btn btn-primary">商品图册</th>
				</tr>
				<tr class="info">
					<td>上传图片</td>
					<td>
						<input type="file" name='photo' id='photo' />
						
					</td>
					<td id="photo_list"></td>
				</tr>
			</table>

			<table class='table'>
				<tr class="next_show">
					<th class="btn btn-primary ">商品详细</th>
				</tr>
				<tr class="info">
					<td>
						<script id="info" type="text/plain" name="intro" style="width:1024px;height:500px;"></script>
					</td>
				</tr>
			</table>

			<input type="submit" value="确认添加" class="btn btn-primary btn-block btn-large" />
		</fieldset>
	</form>

	</div>
	</div>
	</div>
	
<script type="text/javascript">
	$(function() {
	    $("#pic").uploadify({
	    	fileTypeDesc : '请选择图片',
	    	uploadLimit : 1000,
	    	fileTypeExts : '*.gif; *.jpeg; *.jpg; *.png',
	    	buttonImage : "__STATIC__/uploadify/btn.png",
	    	width	: 120,
	        height  : 30,
	        multi 	: false,
	        swf		: "__STATIC__/uploadify/uploadify.swf",
	        uploader: '{|U:'upload',array('multi'=>0)}',
	        //解决某些浏览器(主要是FF)Uploadify上传时丢失SESSION问题
	        formData : {'<?php echo session_name();?>' : '<?php echo session_id();?>'},
	        onUploadSuccess : function(file, data, response) {
	        	eval('data=' + data);
	        	if(data.status == 1){
	        		var str = '<div class="pic_div"><img src="__ROOT__/' + data.name + '" width="100" height="100" /></div>';
        			$('#p_list').empty().append(str).fadeIn(2000,"swing",function(){
        				$("input[name=list_pic]").val(data.name);
        			});
	    			// 设置 表单验证中的list_up值为1
	    			
	        	}else{
	        		alert(data.msg);
	        	}
        	}
	    });
	    // 上传商品图册
	    $("#photo").uploadify({
	    	fileTypeDesc : '请选择图片',
	    	uploadLimit : 1000,
	    	fileTypeExts : '*.gif; *.jpeg; *.jpg; *.png',
	    	buttonImage : "__STATIC__/uploadify/btn.png",
	    	width	: 120,
	        height  : 30,
	        swf		: "__STATIC__/uploadify/uploadify.swf",
	        uploader: '{|U:'upload',array('multi'=>1)}',
	        //解决某些浏览器(主要是FF)Uploadify上传时丢失SESSION问题
	        formData : {'<?php echo session_name();?>' : '<?php echo session_id();?>'},
	        onUploadSuccess : function(file, data, response) {
	        	eval('data=' + data);
	        	if(data.status == 1){
	          		var div = '<div class="pic_div">';
	    			div += '<img src="__ROOT__/' + data.small + '" width="100" height="100" />';
	    			div += '<input type="hidden" name="big_pic[]" value="' + data.big + '"/>';
	    			div += '<input type="hidden" name="small_pic[]" value="' + data.small + '"/>';
	    			$('#photo_list').append(div);
	    			// 设置 表单验证中的photo_up值为1
	    			
	        	}else{
	        		alert(data.msg);
	        	}
        	}
	    });
	    
	});
</script>	
	
	
</body>
</html>